<!--企业-花名册-参建单位列表-->
<template>
  <div class="container" ref="mainCon">
    <div class="mainCon">
      <el-row class="toolbar searchInputWidth" style="padding-bottom: 0">
        <el-form :inline="true" :model="filterField" ref="searchConditions">
          <el-col :lg="8" :xl="6">
            <el-form-item label="参建单位" class="row-padding-bottom">
              <el-input
                placeholder="请输入参建单位"
                clearable
                v-model="filterField.companyName"
                @blur="filterField.companyName = changeValue($event)"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :lg="8" :xl="6">
            <el-form-item label="角色" class="row-padding-bottom name">
              <el-select
                v-model="filterField.typeId"
                clearable
                filterable
                placeholder="请选择"
              >
                <el-option
                  v-for="(item, index) of roleList"
                  :key="index"
                  :label="item.name"
                  :value="item.code"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <template v-if="advanced">
            <el-col :lg="8" :xl="6">
              <el-form-item label="进退场状态" class="row-padding-bottom">
                <el-select
                  v-model="filterField.status"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="(item, index) of statusList"
                    :key="index"
                    :label="item.name"
                    :value="item.code"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </template>
          <el-form-item label="">
            <a
              @click="toggleAdvanced"
              style="margin-left: 40px; color: #409eff; cursor: pointer"
              class="btnColor"
            >
              {{ advanced ? '收起' : '展开' }}
              <i
                :class="advanced ? 'el-icon-arrow-up' : 'el-icon-arrow-down'"
              ></i>
            </a>
            <el-button
              type="primary"
              icon="icon iconfont iconchazhao1"
              @click="searchList"
              class="searchBtn"
            >
              <span>搜索</span>
            </el-button>
            <exportBtn
              v-if="
                !(
                  isShowAdd &&
                  (isJS ||
                    userType == 'PROJECT_ADMINISTRATOR' ||
                    userType == 'LABOR_ADMINISTRATOR')
                )
              "
              :dataLen="tableList.length"
              :filterField="filterField"
              api="api-s/report/export_QY_BULID_COMPANY"
            ></exportBtn>
          </el-form-item>
          <!-- <el-form-item v-if = "isShowAdd">
                    <el-button class="commonBut saveBtn funComBut" icon="iconfont icontianjia" @click="toOpenAdd" v-show ="isJS || userType == 'PROJECT_ADMINISTRATOR' || userType == 'LABOR_ADMINISTRATOR'">
                        <span class="opetareText">参建单位进场</span>
                    </el-button>
                    <exportBtn :dataLen="tableList.length" :filterField="filterField" api="api-s/report/export_QY_BULID_COMPANY"></exportBtn>
                </el-form-item> -->
        </el-form>
      </el-row>
      <!-- <el-row class="toolbar searchInputWidth" style="padding-bottom:0" v-if = "!jcDetail">
      <el-col :span="24" style="text-align: right;padding: 20px 10px;">
        <el-button class="commonBut saveBtn funComBut" icon="iconfont icontianjia" @click="toOpenAdd" v-show="isShowAdd" >
          <span class="opetareText">参建单位进场</span>
        </el-button></el-col>
    </el-row> -->
      <!-- 建设方和项目端有参建单位进场添加 -->

      <div class="spacing"></div>
      <div
        ref="tableBox"
        :class="hiddleToolBar ? 'tableBoxCur tableBox' : 'tableBoxCur'"
      >
        <div
          style="margin-bottom: 24px"
          v-if="
            isShowAdd &&
            (isJS ||
              userType == 'PROJECT_ADMINISTRATOR' ||
              userType == 'LABOR_ADMINISTRATOR')
          "
        >
          <el-button
            class="commonBut saveBtn funComBut"
            icon="iconfont icontianjia"
            @click="toOpenAdd"
          >
            <span class="opetareText">参建单位进场</span>
          </el-button>
          <exportBtn
            :dataLen="tableList.length"
            :filterField="filterField"
            api="api-s/report/export_QY_BULID_COMPANY"
          ></exportBtn>
        </div>
        <el-table
          ref="tableBox1"
          :max-height="tableHeight"
          :data="tableList"
          v-loading="loading"
          :header-cell-style="{ background: '#eef1f6', color: '#606266' }"
          highlight-current-row
          stripe
          style="border: 1px solid #dfe6ec"
        >
          <el-table-column label="参建单位" width="230">
            <template slot-scope="scope">
              <copyText
                :tableIndex="scope.$index"
                :copyTextName="scope.row.companyName"
                :columnName="'companyName'"
              ></copyText>
            </template>
          </el-table-column>
          <el-table-column
            prop="type"
            label="角色"
            align="center"
            :formatter="formatTd"
          ></el-table-column>
          <el-table-column
            prop="status"
            label="进退场状态"
            align="center"
            :formatter="formatTd"
          ></el-table-column>
          <el-table-column
            prop="contractType"
            label="承包类型"
            align="center"
            :formatter="formatTd"
          ></el-table-column>
          <el-table-column
            prop="manager"
            label="企业负责人"
            align="center"
            :formatter="formatTd"
          ></el-table-column>
          <el-table-column
            prop="managerTel"
            label="负责人联系电话"
            align="center"
            :formatter="formatTd"
          ></el-table-column>
          <el-table-column label="操作" align="left" fixed="right">
            <!-- <template slot-scope="scope">
          <div v-if=" isShowDetail ||  !jcDetail && isShowUpdate">
            <el-link type="primary"  v-show="isShowDetail" @click="toDetail(scope.$index, scope.row)">查看</el-link>
            <el-link type="primary" v-show="!jcDetail && isShowUpdate" @click="toOpenUpdate(scope.$index, scope.row)">修改</el-link>
          </div>
          <div v-else>
            <span type="primary">--</span>
          </div>
        </template> -->
            <template slot-scope="scope">
              <div v-if="isJS">
                <el-link
                  v-if="isShowDetail"
                  type="primary"
                  @click="toDetail(scope.$index, scope.row)"
                  >查看</el-link
                >
                <el-link
                  v-if="isShowUpdate && scope.row.createType == 'COMPANY'"
                  type="primary"
                  @click="toOpenUpdate(scope.$index, scope.row)"
                  >修改</el-link
                >
                <el-link
                  v-if="
                    isShowDelete &&
                    scope.row.createType == 'COMPANY' &&
                    scope.row.delFlag
                  "
                  type="primary"
                  @click="handleDelete(scope.$index, scope.row)"
                  >删除</el-link
                >
              </div>
              <div
                v-else-if="
                  userType == 'PROJECT_ADMINISTRATOR' ||
                  userType == 'LABOR_ADMINISTRATOR' ||
                  (userType == 'COMPANY' && !isJS) ||
                  userType === 'MONITOR'
                "
              >
                <template v-if="!isCzUser()">
                  <el-link
                    v-if="isShowDetail"
                    type="primary"
                    @click="toDetail(scope.$index, scope.row)"
                    >查看</el-link
                  >
                  <el-link
                    v-if="
                      isShowUpdate &&
                      (scope.row.createType == 'PROJECT_ADMINISTRATOR' ||
                        scope.row.createType == 'LABOR_ADMINISTRATOR') &&
                      (scope.row.typeId == '10' || scope.row.typeId == '15')
                    "
                    type="primary"
                    @click="toOpenUpdate(scope.$index, scope.row)"
                    >修改</el-link
                  >
                </template>
                <template v-else>
                  <el-link
                    v-if="isShowDetail"
                    type="primary"
                    @click="toDetail(scope.$index, scope.row)"
                    >查看</el-link
                  >
                  <el-link
                    v-if="
                      isShowUpdate &&
                      (scope.row.typeId == '10' ||
                        scope.row.typeId == '15' ||
                        scope.row.typeId == '5')
                    "
                    type="primary"
                    @click="toOpenUpdate(scope.$index, scope.row)"
                    >修改</el-link
                  >
                </template>
              </div>
              <div v-else>
                <el-link
                  v-show="isShowDetail"
                  type="primary"
                  @click="toDetail(scope.$index, scope.row)"
                  >查看</el-link
                >
              </div>
            </template>
          </el-table-column>
          <!-- 表格数据为空时，页面显示 -->
          <div slot="empty" v-show="isShow">
            <emptyTable emptyText="暂无相关信息"></emptyTable>
          </div>
        </el-table>
        <Pagination
          ref="pagination"
          @getpageSize="getpageSize"
          @getpageNo="getpageNo"
          @getList="getTableList"
          :filterField="filterField"
          :requestUrl="requestUrl"
        ></Pagination>
      </div>
    </div>

    <!--修改参建单位信息-->
    <el-dialog
      class="doubleColumnsDialog"
      :title="dialogTitle + '参建单位信息'"
      :visible.sync="dialogVisible"
      width="900px"
      :close-on-click-modal="false"
      :modal-append-to-body="false"
      :close-on-press-escape="false"
      :before-close="handleClose"
    >
      <el-form
        :model="formData"
        ref="formRef"
        :rules="fromRules"
        label-width="164px"
        :validate-on-rule-change="false"
      >
        <el-row>
          <el-form-item label="所属项目：">
            {{ formData.projectName }}
          </el-form-item>
        </el-row>
        <template v-if="!isJS">
          <el-row>
            <el-col :span="12">
              <el-form-item :label="'统一社会信用代码：'" prop="uscc">
                <el-input
                  v-model.trim="formData.uscc"
                  @change="
                    validUsccAndCompany(formData.companyName, formData.uscc)
                  "
                  class="form-item"
                  :disabled="isConstructorType"
                  ref="uscc"
                  placeholder="请输入统一社会信用代码"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="参建单位名称：" prop="companyName">
                <el-input
                  v-model.trim="formData.companyName"
                  @change="
                    validUsccAndCompany(formData.companyName, formData.uscc)
                  "
                  :disabled="isConstructorType"
                  class="form-item"
                  placeholder="请输入参建单位名称"
                ></el-input>
              </el-form-item>
            </el-col>
            <!-- </el-row>
            <el-row> -->
            <el-col :span="12">
              <el-form-item label="企业经营区域：" prop="areaId">
                <el-cascader
                  ref="areas"
                  v-model="filterFieldArea"
                  :options="areasOptions"
                  @change="getAreaIdSearch"
                  clearable
                  filterable
                  placeholder="请选择"
                  class="form-item form-item1"
                  :props="{ checkStrictly: false }"
                ></el-cascader>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="企业地址：" prop="address">
                <el-input
                  v-model.trim="formData.address"
                  @input="handleAddressInput"
                  maxlength="80"
                  show-word-limit
                  class="form-item"
                  placeholder="请输入企业地址"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <!-- </el-row>
            <el-row> -->
            <el-col :span="12">
              <el-form-item label="参建单位类型：" prop="contractbytype">
                <template v-if="!isCzUser()">
                  <el-select
                    v-model="formData.contractbytype"
                    :disabled="cpDisabled"
                    placeholder="请选择参建单位类型"
                    clearable
                    class="form-item form-item1"
                  >
                    <el-option
                      v-for="item in contractbytypeOption.filter(
                        (v) => v.code != '5'
                      )"
                      :key="item.code"
                      :label="item.name"
                      :value="item.code"
                    ></el-option>
                  </el-select>
                </template>
                <template v-else>
                  <el-select
                    v-model="formData.contractbytype"
                    :disabled="isConstructorType"
                    placeholder="请选择参建单位类型"
                    clearable
                    class="form-item form-item1"
                  >
                    <el-option
                      v-for="item in isConstructorType
                        ? contractbytypeOption
                        : contractbytypeOption.filter((v) => v.code != '5')"
                      :key="item.code"
                      :label="item.name"
                      :value="item.code"
                    ></el-option>
                  </el-select>
                </template>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                label="承包类型："
                prop="contractType"
                v-if="formData.contractbytype == '10'"
                clearable
              >
                <el-select
                  v-model="formData.contractType"
                  placeholder="请选择承包类型"
                  class="form-item form-item1"
                >
                  <el-option
                    v-for="item in contractOptions"
                    :key="item.code"
                    :label="item.name"
                    :value="item.code"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <!-- </el-row>
            <el-row> -->
            <el-col :span="12">
              <el-form-item :label="'企业法定代表人：'" prop="boss">
                <el-input
                  v-model="formData.boss"
                  class="form-item"
                  placeholder="请输入企业法定代表人"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="企业负责人：" prop="manager">
                <el-input
                  v-model="formData.manager"
                  class="form-item"
                  placeholder="请输入企业负责人"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <!-- </el-row>
            <el-row> -->
            <el-col :span="12">
              <el-form-item :label="'负责人联系电话：'" prop="managerTel">
                <el-input
                  v-model="formData.managerTel"
                  class="form-item"
                  placeholder="请输入负责人联系电话"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="项目经理：" prop="projectManager">
                <el-input
                  v-model="formData.projectManager"
                  class="form-item"
                  placeholder="请输入项目经理姓名"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <!-- </el-row>
            <el-row> -->
            <el-col :span="12">
              <el-form-item
                :label="'项目经理联系电话：'"
                prop="projectManagerTel"
              >
                <el-input
                  v-model="formData.projectManagerTel"
                  @input="
                    formData.projectManagerTel =
                      formData.projectManagerTel.replace(/[^\d]/g, '')
                  "
                  class="form-item"
                  placeholder="请输入项目经理联系电话"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="参建合同价：" prop="total" class="unitsItem">
                <el-input
                  v-model="formData.total"
                  @input="formData.total = formData.total.replace(/[^\d]/g, '')"
                  style="width: 250px !important"
                  placeholder="请输入参建合同价，单位为元"
                  clearable
                ></el-input
                ><span style="margin-left: 10px">元</span>
              </el-form-item>
            </el-col>
            <!-- </el-row>
            <el-row> -->
            <el-col :span="24">
              <el-form-item label="备注：" prop="remark" style="width: 100%">
                <el-input
                  type="textarea"
                  placeholder="请输入备注信息"
                  v-model="formData.remark"
                  @input="handleRemarkInput"
                  maxlength="200"
                  show-word-limit
                  class="form-item"
                  clearable
                  rows="3"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row v-if="formData.contractbytype == '10'">
            <el-col :span="24">
              <el-form-item :label="'上传代发委托附件：'">
                <uploadAnnex
                  @getFileList="getFileListOnBehalfOf"
                  :limitationFactor="limitationFactorOnBehalfOf"
                  @getFile="getFileOnBehalfOf"
                  :upLoadFile="formData.upLoadFileOnBehalfOf"
                />
              </el-form-item>
            </el-col>
          </el-row>
          <el-row v-if="formData.contractbytype == '10'">
            <el-col :span="24">
              <uploadResult
                style="margin-left: 150px !important"
                :resultList="formData.upLoadFileOnBehalfOf"
                @callBackResult="callBackResultOnBehalfOf"
              />
            </el-col>
          </el-row>
        </template>
        <template v-else>
          <el-form-item :label="'统一社会信用代码：'" prop="uscc">
            <el-input
              v-model.trim="formData.uscc"
              @change="validUsccAndCompany(formData.companyName, formData.uscc)"
              class="form-item"
              :disabled="cpDisabled"
              ref="uscc"
              placeholder="请输入统一社会信用代码"
            ></el-input>
            <!--          <el-button type="primary" @click.native="validUSCC" class="save" :loading="repairing" v-show="hasRepair">修复</el-button>-->
          </el-form-item>
          <el-form-item label="参建单位名称：" prop="companyName">
            <el-input
              v-model.trim="formData.companyName"
              @change="validUsccAndCompany(formData.companyName, formData.uscc)"
              :disabled="cpDisabled"
              class="form-item"
              placeholder="请输入参建单位名称"
            ></el-input>
          </el-form-item>
          <div v-if="isShowOtherInfo">
            <el-form-item
              label="参建单位类型："
              prop="contractbytype"
              v-if="isJS"
            >
              <el-select
                v-model="formData.contractbytype"
                :disabled="cpDisabled"
                placeholder="请选择参建单位类型"
                class="form-item form-item1"
              >
                <el-option
                  v-for="item in contractbytypeOption"
                  :key="item.code"
                  :label="item.name"
                  :value="item.code"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item
              label="承包类型："
              prop="contractType"
              v-if="
                userType == 'PROJECT_ADMINISTRATOR' ||
                userType == 'LABOR_ADMINISTRATOR' ||
                formData.contractbytype == '10'
              "
            >
              <el-select
                v-model="formData.contractType"
                placeholder="请选择承包类型"
                class="form-item form-item1"
              >
                <el-option
                  v-for="item in contractOptions"
                  :key="item.code"
                  :label="item.name"
                  :value="item.code"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="企业负责人：" prop="manager">
              <el-input
                v-model="formData.manager"
                class="form-item"
                placeholder="请输入企业负责人"
              ></el-input>
            </el-form-item>
            <el-form-item :label="'负责人联系电话：'" prop="managerTel">
              <el-input
                v-model="formData.managerTel"
                class="form-item"
                placeholder="请输入负责人联系电话"
              ></el-input>
            </el-form-item>
            <el-form-item label="备注：" prop="remark">
              <el-input
                type="textarea"
                placeholder="请输入备注信息"
                v-model="formData.remark"
                @input="handleRemarkInput"
                maxlength="200"
                show-word-limit
                class="form-item"
                rows="3"
              ></el-input>
            </el-form-item>
            <el-row v-if="isJS">
              <el-col :span="24">
                <el-form-item :label="'上传合同或资质附件：'" class="unitsItem">
                  <uploadAnnex
                    @getFileList="getFileList"
                    :limitationFactor="limitationFactor"
                    @getFile="getFile"
                    :upLoadFile="formData.upLoadFile"
                  />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row v-if="isJS">
              <el-col :span="24">
                <uploadResult
                  style="margin-left: 120px"
                  :resultList="formData.upLoadFile"
                  @callBackResult="callBackResult"
                />
              </el-col>
            </el-row>
            <el-row v-if="isJS && formData.contractbytype == '10'">
              <el-col :span="24">
                <el-form-item :label="'上传代发委托附件：'" class="unitsItem">
                  <uploadAnnex
                    @getFileList="getFileListOnBehalfOf"
                    :limitationFactor="limitationFactorOnBehalfOf"
                    @getFile="getFileOnBehalfOf"
                    :upLoadFile="formData.upLoadFileOnBehalfOf"
                  />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row v-if="isJS && formData.contractbytype == '10'">
              <el-col :span="24">
                <uploadResult
                  style="margin-left: 120px"
                  :resultList="formData.upLoadFileOnBehalfOf"
                  @callBackResult="callBackResultOnBehalfOf"
                />
              </el-col>
            </el-row>
          </div>
        </template>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="handleClose" class="cancel">取 消</el-button>
        <el-button
          type="primary"
          @click="onSave"
          :loading="isSaveLoading"
          class="save"
          >保存</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: 'participationUnits',
  // props:['projectId','projectName','jcDetail'],
  props: ['projectId', 'projectName', 'isJS', 'fromType'],
  data() {
    var validateUscc = (rule, value, callback) => {
      value = value.replace(/\s+/g, '')
      if (value === '') {
        callback(new Error('统一社会信用代码不能为空'))
      } else {
        var regUscc = /^[0-9A-Z]{2}[0-9]{6}[0-9A-Z]{10}$/
        if (!regUscc.test(value)) {
          callback(new Error('统一社会信用代码格式不正确'))
        } else {
          if (!this.hasRepair) {
            this.axios({
              method: 'post',
              url: 'api-p/projectcompany/expand/findcompanyname',
              data: {
                uscc: value,
              },
            })
              .then((res) => {
                if (!res.data.hasError && res.data.result) {
                  this.formData.companyName = res.data.result
                  this.formData.IsValid = 0
                  callback()
                } else {
                  // callback(new Error(res.data.errorMsg));
                  this.formData.IsValid = 1
                  callback()
                }
              })
              .catch((error) => {
                // callback(new Error('验证失败'));
                this.formData.IsValid = 1
                callback()
              })
          } else {
            this.formData.IsValid = 1
            callback()
          }
        }
      }
    }
    //验证手机号码
    var validatePhone = (rule, value, callback) => {
      if (value) {
        value = value.replace(/\s+/g, '')
      }
      if (value === '') {
        callback(new Error('请输入负责人联系电话'))
      } else {
        var regTel = /^1[3456789]\d{9}$/
        if (!regTel.test(value)) {
          callback(new Error('手机号码格式不正确'))
        } else {
          this.noTel = false
        }
        callback()
      }
    }
    // 参建合同价
    var validateTotal = (rule, value, callback) => {
      if (!value && this.isCzUser()) {
        callback(new Error('请输入参建合同价'))
      } else if (value && value * 1 > 100000000000) {
        callback(new Error('应小于等于100000000000'))
      } else {
        callback()
      }
    }
    var validateType = (rule, value, callback) => {
      if (!value) {
        callback(new Error('请选择参建单位类型'))
      } else if (
        (this.isJS ? value == '5' : value == '5' && !this.isCzUser()) ||
        (value == '15' &&
          this.contractbytypeOld != this.formData.contractbytype)
      ) {
        this.axios({
          method: 'post',
          url: 'api-p/projectcompany/expand/getprocombytype',
          data: {
            projectId: this.projectId,
            type: this.formData.contractbytype,
          },
        })
          .then((res) => {
            if (res.data.hasError) {
              callback(new Error(res.data.errorMsg))
            } else {
              callback()
            }
          })
          .catch((error) => {
            callback()
          })
      } else {
        callback()
      }
    }
    return {
      hiddleToolBar: false,
      tableHeight: null,
      titleText: '参建单位',
      //表格数据
      tableList: [],
      requestUrl: 'api-p/projectcompany/expand/bulidcompanylist',
      hasRepair: false, //添加隐藏修改，修改显示修复
      repairInputWidth: '',
      repairBtnWidth: '',
      isShow: false, //列表加载
      loading: true,
      repairing: false,
      cpDisabled: false,
      dialogVisible: false,
      contractOptions: [],
      contractbytypeOption: [],
      isSaveLoading: false, // 保存loading
      dialogTitle: '',
      isSubmit: false,
      companyName: '',
      filterField: {
        sysAppCode: localStorage.getItem('judgeRoleCode'),
        projectId: '',
        typeId: '',
        companyName: '',
        status: '',
      },
      pageSize: 20,
      pageNo: 1,
      formData: {
        id: '',
        projectId: '',
        projectName: '',
        companyName: '',
        uscc: '',
        contractType: '',
        contractbytype: '',
        manager: '',
        managerTel: '',
        remark: '',
        IsValid: '',
        upLoadFile: [], //附件
        srcList: [],
        oldSrcList: [],
        areaId: '',
        areaName: '',
        address: '',
        boss: '',
        projectManager: '',
        projectManagerTel: '',
        total: '',
        upLoadFileOnBehalfOf: [],
        srcListOnBehalfOf: [],
        oldSrcListOnBehalfOf: [],
      },
      fromRules: {
        companyName: [
          { required: true, message: '请输入参建单位名称', trigger: 'blur' },
        ],
        uscc: [{ required: true, validator: validateUscc, trigger: 'blur' }],
        contractType: [
          { required: true, message: '请选择承包类型', trigger: 'change' },
        ],
        contractbytype: [
          { required: true, validator: validateType, trigger: 'change' },
        ],
        manager: [
          { required: true, message: '请输入企业负责人', trigger: 'blur' },
          {
            pattern: /^[\u4e00-\u9fa5]{2,}$/,
            message: '请输入正确的企业负责人姓名',
            trigger: 'blur',
          },
        ],
        managerTel: [
          { required: true, validator: validatePhone, trigger: 'blur' },
        ],
        boss: [
          {
            pattern: /^[\u4e00-\u9fa5]{2,}$/,
            message: '请输入正确的企业法定代表人姓名',
            trigger: 'blur',
          },
        ],
        projectManager: [
          {
            required: this.isCzUser(),
            message: '请输入项目经理姓名',
            trigger: 'blur',
          },
          {
            pattern: /^[\u4e00-\u9fa5]{2,}$/,
            message: '请输入正确的项目经理姓名',
            trigger: 'blur',
          },
        ],
        projectManagerTel: [
          {
            required: this.isCzUser(),
            message: '请输入项目经理联系电话',
            trigger: 'blur',
          },
          {
            pattern: /^1[3456789]\d{9}$/,
            message: '请输入正确的电话号码',
            trigger: 'blur',
          },
        ],
        total: [
          {
            required: this.isCzUser(),
            validator: validateTotal,
            trigger: 'blur',
          },
        ],
        areaId: [
          {
            required: this.isCzUser(),
            message: '请选择企业经营区域',
            trigger: 'change',
          },
        ],
        address: [
          {
            required: this.isCzUser(),
            message: '请输入企业地址',
            trigger: 'blur',
          },
        ],
        boss: [
          {
            required: this.isCzUser(),
            message: '请输入企业法定代表人',
            trigger: 'blur',
          },
        ],
      },
      isShowDetail: '',
      isShowUpdate: '',
      isShowAdd: '',
      isShowDelete: '',
      loginType: '', //登录类型
      isShowOtherInfo: true,
      oldUscc: '',
      userType: '', //用户类型
      limitationFactor: {
        uploadAnnexUrl: 'api-f/files/upload', //自定义上传文件接口地址
        upLoadFileLength: 10, //自定义上传文件最大数量设置
        fileSize: 5, //自定义上传文件最大设置
        messageFileSizetip: '最多能上传5M以内的图片', //自定义id解决一个页面包含多个上传附件
        messagetip: '要求格式为png，jpg，jpeg，pdf格式，图片大小不超过5M', //自定义报错提示语
        formatType: 'typeFive', //自定义上传格式校验类型
        fileId: 'salaryExcel', //自定义id解决一个页面包含多个上传附件
        uploadFormId: 'salaryExcelForm', //自定义id解决一个页面包含多个上传附件
        methodTip: '合同附件支持png，jpg，jpeg，pdf，最多可上传10个附件', //自定义上传文件提示
        uploadBtnType: 'typeOne', //自定义上传按钮类型
      },
      contractbytypeOld: '', //修改页面老的监理类型
      filterFieldArea: [],
      isConstructorType: false,
      limitationFactorOnBehalfOf: {
        uploadAnnexUrl: 'api-f/files/upload', //自定义上传文件接口地址
        upLoadFileLength: 10, //自定义上传文件最大数量设置
        fileSize: 5, //自定义上传文件最大设置
        messageFileSizetip: '最多能上传5M以内的图片', //自定义id解决一个页面包含多个上传附件
        messagetip: '要求格式为png，jpg，jpeg，pdf格式，图片大小不超过5M', //自定义报错提示语
        formatType: 'typeFive', //自定义上传格式校验类型
        fileId: 'salaryExcelOnBehalfof', //自定义id解决一个页面包含多个上传附件
        uploadFormId: 'salaryExcelFormOnBehalfof', //自定义id解决一个页面包含多个上传附件
        methodTip: '代发委托附件支持png，jpg，jpeg，pdf，最多可上传10个附件', //自定义上传文件提示
        uploadBtnType: 'typeOne', //自定义上传按钮类型
      },
      roleList: [
        {
          name: '建设方',
          code: '0',
        },
        {
          name: '施工方',
          code: '5',
        },
        {
          name: '分包单位',
          code: '10',
        },
        {
          name: '监理单位',
          code: '15',
        },
      ],
      statusList: [
        {
          name: '退场',
          code: '0',
        },
        {
          name: '进场',
          code: '1',
        },
      ],
      advanced: false,
    }
  },
  created() {
    this.selectAreas()
    this.loginType = localStorage.getItem('loginType')
    this.userType = this.$store.state.userType
    this.formData.projectId = this.projectId
    this.formData.projectName = this.projectName
    this.filterField.projectId = this.projectId
    this.$nextTick(function () {
      this.$refs.pagination.getTableListData()
    })
    this.getContractData()
    this.isShowDetail =
      this.$store.state.buttonLimitsArr.indexOf('csRoster:detail') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('mProjectList:detail') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectList:detail') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('csRosterSGF:detail') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('csRosterJSF:detail') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectListJSF:detail') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectListSGF:detail') > -1
    this.isShowAdd =
      this.$store.state.buttonLimitsArr.indexOf('csRoster:add') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('mProjectList:add') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectList:add') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('csRosterSGF:add') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('csRosterJSF:add') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectListJSF:add') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectListSGF:add') > -1
    this.isShowUpdate =
      this.$store.state.buttonLimitsArr.indexOf('csRoster:update') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('mProjectList:update') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectList:update') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('csRosterSGF:update') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('csRosterJSF:update') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectListJSF:update') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectListSGF:update') > -1
    this.isShowDelete =
      this.$store.state.buttonLimitsArr.indexOf('csRoster:delete') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('mProjectList:delete') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectList:delete') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('csRosterSGF:delete') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('csRosterJSF:delete') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectListJSF:delete') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectListSGF:delete') > -1
    //参建单位类型
    this.getContractbytype()
  },
  mounted() {
    window.addEventListener('scroll', this.handleScroll, true)
    let that = this
    this.$nextTick(function () {
      let tableHeightCur = this.$refs.tableBox1.$el.clientHeight
      let tableTop = this.$refs.tableBox.getBoundingClientRect().top
      if (tableHeightCur + tableTop > window.innerHeight) {
        this.tableHeight =
          this.$refs.mainCon.getBoundingClientRect().height - 290
      } else {
        document.getElementsByClassName('tableBoxCur').length &&
          (document.getElementsByClassName('tableBoxCur')[0].style.height =
            window.innerHeight - tableTop - 328 + 'px')
      }
      window.onresize = function () {
        if (!that.$refs.tableBox1) {
          return
        }
        let tableHeightCur = that.$refs.tableBox1.$el.clientHeight
        let tableTop = that.$refs.tableBox.getBoundingClientRect().top
        if (tableHeightCur + tableTop > window.innerHeight) {
          that.tableHeight =
            that.$refs.mainCon.getBoundingClientRect().height - 300
        } else {
          document.getElementsByClassName('tableBoxCur').length &&
            (document.getElementsByClassName('tableBoxCur')[0].style.height =
              window.innerHeight - tableTop - 40 + 'px')
        }
      }
    })
  },
  activated() {
    window.addEventListener('scroll', this.handleScroll, true)
    this.$nextTick(function () {
      this.$refs.pagination.getTableListData(this.pageNo, this.pageSize)
    })
    this.$nextTick(function () {
      this.$refs.tableBox1.doLayout()
    })
  },
  deactivated() {
    let that = this
    window.removeEventListener('scroll', that.handleScroll, true)
  },
  beforeDestroy() {
    let that = this
    window.removeEventListener('scroll', that.handleScroll, true)
  },
  methods: {
    toggleAdvanced() {
      this.advanced = !this.advanced
    },
    handleScroll(e) {
      this.$nextTick(function () {
        //变量scrollTop是滚动条滚动时，距离顶部的距离
        var scrollTop = e.target.scrollTop
        if (
          this.$refs.tableBox &&
          this.$refs.tableBox.getBoundingClientRect().top < 128
        ) {
          this.tableHeight = window.innerHeight - 238
          if (document.getElementsByClassName('tableBoxCur').length) {
            document.getElementsByClassName('tableBoxCur')[0].style.height =
              null
          }
          this.hiddleToolBar = true
        } else {
          this.hiddleToolBar = false
        }
      })
    },
    getpageSize(val) {
      this.pageSize = val
    },
    getpageNo(val) {
      this.pageNo = val
    },
    selectAreas() {
      return this.axios({
        method: 'post',
        url: 'api-bs/areadic/base/depdetailbyareaid',
        data: {
          areaId: 0,
        },
      })
        .then((res) => {
          if (!res.data.hasError) {
            this.areasOptions = res.data.result
          } else {
            this.$message.error(response.data.errorMsg)
          }
        })
        .catch((error) => {
          if (error.response) {
            this.$message.error(error.response.data)
          }
        })
    },
    //获取搜索选中的区域最后一级id
    getAreaIdSearch() {
      if (this.filterFieldArea) {
        this.formData.areaId =
          this.filterFieldArea[this.filterFieldArea.length - 1]
        const recursiveFlat = (arr) =>
          arr.flatMap((v) =>
            v.children ? [...recursiveFlat(v.children), v] : v
          )
        const unfold = recursiveFlat(this.areasOptions)
        let areaNameStr = ''
        for (let i = 0; i < this.filterFieldArea.length; i++) {
          let index = unfold.findIndex(
            (v) => v.value === this.filterFieldArea[i]
          )
          areaNameStr += index > -1 ? unfold[index].label : ''
        }
        this.formData.areaName = areaNameStr
      }
    },
    handleAddressInput(value) {
      let reg = /<\/?.+?\/?>/g
      this.formData.address = value.replace(reg, '')
    },
    handleRemarkInput(value) {
      let reg = /<\/?.+?\/?>/g
      this.formData.remark = value.replace(reg, '')
    },
    handleClose() {
      this.restFiled()
      this.dialogVisible = false
    },
    getTableList(data) {
      this.tableList = data
      this.loading = false
      if (this.tableList.length < 1) {
        this.isShow = true
      }
    },
    validUSCC() {
      // this.$refs.formRef.validateField('uscc', (Error) => {
      // });
      let value = this.formData.uscc
      this.repairing = true
      this.axios({
        method: 'post',
        url: 'api-p/projectcompany/expand/findcompanyname',
        data: {
          uscc: value,
        },
      })
        .then((res) => {
          this.repairing = false
          if (!res.data.hasError) {
            this.formData.companyName = res.data.result
            this.repairing = false
          }
        })
        .catch((error) => {
          this.repairing = false
        })
    },
    // 搜索
    searchList() {
      this.filterField.projectId = this.projectId
      this.$refs.pagination.getTableListData()
    },
    //跳转详情
    toDetail(index, row) {
      this.$router.push({
        path: '/home/employee/participationUnitsDetail',
        name: 'participationUnitsDetail',
        query: {
          id: row.id,
          uscc: row.uscc,
          projectId: this.projectId,
          type: this.fromType,
          isJSAdd: row.createType, //是否是建设方添加的
        },
      })
      var oldUrls
      // if(this.jcDetail) {
      //   oldUrls = "/home/project/projectList"
      // }else {
      //   oldUrls = "/home/employee/projectEmployeeQY"
      // }
      // if(this.loginType === "JC") {
      //     oldUrls = "/home/project/projectList"
      // }else if(this.loginType === "QY" || this.loginType === "XM"){//企业看板参建单位
      //     oldUrls = "/home/project/projectListQY"
      // } else {
      //     oldUrls = "/home/employee/projectEmployeeQY"
      // }
      // if(this.userType == ('PROJECT_ADMINISTRATOR' || 'LABOR_ADMINISTRATOR')){
      //     oldUrls = "/home/employee/projectEmployeeQY"
      // }else if(this.userType == "COMPANY"){
      //     oldUrls = "/home/project/projectListQY"
      // } else {
      //     oldUrls = "/home/project/projectList"
      // }
      // this.$store.commit("CHANGE_SLIDER_NAME", {
      //   oldUrl:oldUrls,
      //   newUrl: this.$router.currentRoute.fullPath
      // });
      if (this.loginType === 'JC') {
        oldUrls = '/home/project/projectList'
      } else if (this.fromType === 'projectDetail' && this.loginType !== 'JC') {
        oldUrls = '/home/project/projectListQY'
      } else {
        oldUrls = '/home/employee/projectEmployeeQY'
      }
      this.$store.commit('CHANGE_SLIDER_NAME', {
        oldUrl: oldUrls,
        newUrl: this.$router.currentRoute.fullPath,
      })
    },
    restFiled() {
      this.$nextTick(() => {
        this.$refs['formRef'].resetFields()
      })
    },
    toOpenAdd() {
      this.formData.projectId = this.projectId
      this.formData.projectName = this.projectName
      this.formData.id = ''
      this.formData.companyName = ''
      this.formData.uscc = ''
      this.formData.contractType = ''
      this.formData.contractbytype = '' //新增置空参建单位类型
      this.formData.manager = ''
      this.formData.managerTel = ''
      this.formData.remark = ''
      this.formData.IsValid = ''
      this.hasRepair = false
      this.repairInputWidth = '300'
      this.cpDisabled = false
      this.dialogTitle = '添加'
      this.isShowOtherInfo = true
      this.dialogVisible = true
      this.formData.upLoadFile = []
      this.formData.areaId = ''
      this.formData.areaName = ''
      this.formData.address = ''
      this.formData.boss = ''
      this.formData.projectManager = ''
      this.formData.projectManagerTel = ''
      this.formData.total = ''
      this.filterFieldArea = ''
      this.formData.upLoadFileOnBehalfOf = []
      this.$nextTick(() => {
        // 清除高亮
        this.$refs['areas'].panel.activePath = []
      })
      this.isConstructorType = false
      this.restFiled()
    },
    toOpenUpdate(index, row) {
      this.dialogVisible = true
      // this.restFiled();
      this.dialogTitle = '修改'
      this.repairInputWidth = '240'
      this.repairBtnWidth = '80'
      this.hasRepair = false
      if (row.type == '建设方' || row.type == '施工方') {
        this.isShowOtherInfo = false
      } else {
        this.isShowOtherInfo = true
      }
      this.isConstructorType = row.typeId === '5'
      this.axios({
        method: 'post',
        url: 'api-p/projectcompany/expand/finddetailbyid',
        data: {
          id: row.id,
        },
      })
        .then((res) => {
          if (!res.data.hasError) {
            let obj = res.data.result
            this.formData.id = row.id
            this.formData.projectId = this.projectId
            this.formData.projectName = this.projectName
            this.formData.companyName = obj.companyName
            this.companyName = obj.companyName
            this.formData.uscc = obj.uscc
            this.oldUscc = obj.uscc
            this.formData.contractType = obj.contractCode
            this.formData.contractbytype = obj.typeId //参建单位类型
            this.contractbytypeOld = obj.typeId
            this.formData.manager = obj.manager
            this.formData.managerTel = obj.managerTel
            this.formData.remark = obj.remark
            this.formData.upLoadFile = obj.contractFiles
            for (var i = 0; i < this.formData.upLoadFile.length; i++) {
              this.formData.srcList.push(this.formData.upLoadFile[i].url)
              this.formData.oldSrcList.push(this.formData.upLoadFile[i].url)
            }
            this.formData.upLoadFileOnBehalfOf = obj.assignmentFiles
            for (
              var i = 0;
              i < this.formData.upLoadFileOnBehalfOf.length;
              i++
            ) {
              this.formData.srcListOnBehalfOf.push(
                this.formData.upLoadFileOnBehalfOf[i].url
              )
              this.formData.oldSrcListOnBehalfOf.push(
                this.formData.upLoadFileOnBehalfOf[i].url
              )
            }
            this.formData.areaId = obj.areaId
            this.filterFieldArea = obj.areaId
            if (!obj.areaId) {
              this.$nextTick(() => {
                // 清除高亮
                this.$refs['areas'].panel.activePath = []
              })
            }
            this.formData.address = obj.address
            this.formData.boss = obj.boss
            this.formData.projectManager = obj.projectManager
            this.formData.projectManagerTel = obj.projectManagerTel
            this.formData.total = obj.total
            this.formData.areaName = obj.areaName
            this.$nextTick(() => {
              this.$refs['formRef'].clearValidate()
            })
          } else {
            this.$message({
              type: 'error',
              message: res.data.errorMsg,
            })
          }
        })
        .catch((error) => {})
    },
    getContractData() {
      this.axios({
        method: 'post',
        url: 'api-p/projectcompany/expand/findcontractbytype',
        data: {
          type: 'CONTRACT_TYPE',
        },
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.contractOptions = response.data.result
          }
        })
        .catch((response) => {})
    },
    judgeCompanyAccount() {
      this.axios({
        method: 'post',
        url: 'api-acc/companyaccount/expand/isMoreAccount',
        data: {
          uscc: this.oldUscc, //施工方统一社会信用代码
        },
      })
        .then((response) => {
          //true表示是一专户多项目
          if (response.data.hasError) {
            this.showTipZH(
              response.data.result.companyName,
              response.data.result.uscc
            )
          } else {
            this.isSaveLoading = true
            this.submitFormUptate('add')
          }
        })
        .catch((error) => {})
    },
    showTipZH(companyName, uscc) {
      var html =
        '<div>该项目已使用了' +
        companyName +
        '公司（' +
        uscc +
        '）设立的统一专户' +
        '修改后将解除该项目对于统一专户的使用，请确认是否修改施工方信息' +
        '</div>'
      this.$confirm(html, '提示', {
        dangerouslyUseHTMLString: true,
        type: 'warning',
        confirmButtonText: '确定',
        cancelButtonText: '取消',
      })
        .then((action) => {
          this.isSaveLoading = true
          this.submitFormUptate('add')
        })
        .catch(() => {})
    },
    onSave() {
      this.isSaveLoading = true
      this.$refs['formRef'].validate((valid) => {
        if (valid) {
          // 保存更新
          if (
            this.dialogTitle == '修改' &&
            this.oldUscc != this.formData.uscc
          ) {
            this.judgeCompanyAccount()
          } else {
            this.submitFormUptate('add')
          }
        } else {
          this.isSaveLoading = false
          return false
        }
      })
    },
    submitFormUptate(params) {
      var data = {
        id: this.formData.id,
        projectId: this.formData.projectId,
        projectName: this.formData.projectName,
        companyName: this.formData.companyName.replace(/\s+/g, ''),
        uscc: this.formData.uscc.replace(/\s+/g, ''),
        //   contractType: this.formData.contractType,
        type: this.formData.contractbytype,
        manager: this.formData.manager,
        managerTel: this.formData.managerTel,
        IsValid: this.formData.IsValid,
        remark: this.formData.remark,
        files: JSON.stringify(this.formData.upLoadFile),
        areaId: this.formData.areaId,
        areaName: this.formData.areaName,
        address: this.formData.address,
        boss: this.formData.boss,
        projectManager: this.formData.projectManager,
        projectManagerTel: this.formData.projectManagerTel,
        total: this.formData.total,
        assignmentUrl: JSON.stringify(this.formData.upLoadFileOnBehalfOf),
      }
      if (this.formData.contractbytype != '15') {
        Object.assign(data, {
          contractType: this.formData.contractType,
        })
      }
      this.axios({
        method: 'post',
        url: 'api-p/projectcompany/expand/addoredit',
        data: data,
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.isSaveLoading = false
            this.$message({
              message: '保存成功',
              type: 'success',
            })
            this.dialogVisible = false
            this.formData.upLoadFile = []
            this.formData.upLoadFileOnBehalfOf = []
            //   this.searchList()
            this.filterField.projectId = this.projectId
            this.$refs.pagination.getTableListData(this.pageNo, this.pageSize)
          } else {
            this.$message({
              type: 'error',
              message: response.data.errorMsg,
            })
            this.isSaveLoading = false
          }
        })
        .catch((error) => {
          this.$message.error('保存失败')
          this.isSaveLoading = false
        })
    },
    getContractbytype() {
      this.axios({
        method: 'post',
        url: 'api-p/projectcompany/expand/findcompanytypelist',
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.contractbytypeOption = response.data.result
          }
        })
        .catch((response) => {})
    },
    getFileList(val) {
      this.formData.oldSrcList.push(val)
      this.formData.srcList.push(val)
    },
    getFile(val) {
      this.formData.upLoadFile = val
    },
    callBackResult(val) {
      this.formData.upLoadFile = val
    },
    //建设方添加的参建单位删除,
    handleDelete(index, row) {
      this.axios({
        method: 'post',
        url: 'api-p/projectcompany/expand/checkCompanyGroup',
        data: {
          uscc: row.uscc,
          projectId: this.projectId,
        },
      })
        .then((response) => {
          if (!response.data.hasError && response.data.result > 0) {
            this.showTip(response.data.result, row)
          } else {
            this.handleDeleteNext(row)
          }
        })
        .catch((error) => {})
    },
    showTip(groupNum, row) {
      var html =
        '<div>该单位下有' +
        groupNum +
        '个班组' +
        '人数为0，是否确认删除' +
        '</div>'
      this.$confirm(html, '提示', {
        dangerouslyUseHTMLString: true,
        type: 'warning',
        confirmButtonText: '确定',
        cancelButtonText: '取消',
      })
        .then((action) => {
          this.toDel(row.id)
        })
        .catch(() => {})
    },
    handleDeleteNext(row) {
      this.$confirm('确认删除该记录吗?', '提示', {
        cancelButtonClass: 'btn-custom-cancel',
        type: 'warning',
      })
        .then(() => {
          this.toDel(row.id)
        })
        .catch(() => {})
    },
    toDel(id) {
      this.axios({
        method: 'post',
        url: 'api-p/projectcompany/expand/delprojectcompanyandgroup',
        data: {
          id: id,
          projectId: this.projectId,
        },
      })
        .then(
          (response) => {
            if (!response.data.hasError) {
              this.$message({
                message: '删除成功',
                type: 'success',
              })
              this.$nextTick(function () {
                this.$refs.pagination.getTableListData()
              })
            } else {
              this.$message({
                message: response.data.errorMsg,
                type: 'error',
              })
            }
          },
          (response) => {}
        )
        .catch((error) => {})
    },
    validUsccAndCompany(companyName, uscc) {
      if (companyName && uscc) {
        this.axios({
          method: 'post',
          url: 'api-c/companyaudit/base/validcompanybyproject',
          data: {
            name: companyName.replace(/\s+/g, ''),
            uscc: uscc.replace(/\s+/g, ''),
          },
        })
          .then((res) => {
            if (!res.data.hasError) {
              this.$message({
                message: '已通过校验',
                type: 'success',
              })
            } else {
              if (res.data.errorCode == 'unmatched') {
                this.$message({
                  message: '未通过校验，请确认信息是否准确',
                  type: 'warning',
                })
              }
            }
          })
          .catch((error) => {
            this.$message.error('验证失败')
          })
      }
    },
    getFileListOnBehalfOf(val) {
      this.formData.oldSrcListOnBehalfOf.push(val)
      this.formData.srcListOnBehalfOf.push(val)
    },
    getFileOnBehalfOf(val) {
      this.formData.upLoadFileOnBehalfOf = val
    },
    callBackResultOnBehalfOf(val) {
      this.formData.upLoadFileOnBehalfOf = val
    },
  },
  // mounted(){
  //     window.addEventListener('scroll', this.handleScroll, true)
  //     let that = this
  //     this.$nextTick(function () {
  //             let tableHeightCur = this.$refs.tableBox1.$el.clientHeight
  //             let tableTop = this.$refs.tableBox.getBoundingClientRect().top
  //             if(tableHeightCur + tableTop > window.innerHeight){
  //                 this.tableHeight =  window.innerHeight - 240
  //             }else{
  //                 document.getElementsByClassName('tableBoxCur').length&&(document.getElementsByClassName('tableBoxCur')[0].style.height = window.innerHeight - tableTop - 40 + 'px')
  //             }

  //             window.onresize = function(){
  //                 let tableHeightCur = that.$refs.tableBox1.$el.clientHeight
  //                 let tableTop = that.$refs.tableBox.getBoundingClientRect().top
  //                 if(tableHeightCur + tableTop > window.innerHeight){
  //                     that.tableHeight = that.$refs.mainCon.getBoundingClientRect().height - 86
  //                 }else{
  //                     document.getElementsByClassName('tableBoxCur').length&&(document.getElementsByClassName('tableBoxCur')[0].style.height = window.innerHeight - tableTop - 40 + 'px')
  //                 }
  //             }
  //     })
  // }
}
</script>

<style scoped lang="less">
.form-item {
  width: calc(100% - 30px);
}
/deep/ .el-cascader {
  width: calc(100% - 30px);
}
.container {
  height: calc(100%);
}
.mainCon {
  height: calc(100%);
  padding-top: 24px;
}
@import '../../../static/css/filterArea.less';
.doubleColumnsDialog .form-item,
.doubleColumnsDialog .el-cascader {
  width: 275px !important;
}
.doubleColumnsDialog .el-textarea {
  width: 100% !important;
}
/deep/.doubleColumnsDialog .form-item1 .el-input {
  width: 275px !important;
}
</style>
